<svg viewBox='0 0 800 320' class='fm-chart'>
  <style type='text/css'>
  <![CDATA[
  .fm-chart text, .fm-tooltip {
    font-family: "Helvetica Neue", Helvetica, Arial, "Lucida Grande", sans-serif;
    font: 10px sans-serif;
  }

  .fm-chart .axis .stroke {
    stroke: #aaa;
    stroke-width: 1px;
  }

  .fm-chart .axis .tick {
    stroke: #aaa;
    stroke-width: 1px;
  }

  .fm-chart .axis .label, .axis .title {
    fill: #666;
  }

  .fm-chart .axis .label {
    font-size: 10px;
  }

  .fm-chart .axis .title {
    font-size: 10px;
  }

  .fm-chart .chart-title {
    font-size: 12px;
    font-weight: bold;
  }

  .fm-chart .chart-subtitle {
    font-size: 10px;
  }

  .fm-chart text.label {
    fill: #666;
  }

  .fm-chart .legend text {
    font-size: 10px;
    fill: #333;
  }

  .fm-chart .legend text.title {
    fill: #666;
  }

  .fm-chart .line {
    fill: none;
    stroke: #000;
  }

  .fm-chart .area {
    opacity: 0.8;
  }

  .fm-chart .grid .gridline {
    stroke: #ddd;
    stroke-width: 0.02em;
  }

  .fm-chart .bar,
  .fm-chart .point,
  .fm-chart .area {
    fill: #000;
  }

  .fm-chart .bar.color6,
  .fm-chart .point.color6,
  .fm-chart .area.color6 {
    fill: #db843d;
  }

  .fm-chart .lines .line.color6 {
    strok: #db843d;
  }

  .fm-chart .bar.color5,
  .fm-chart .point.color5,
  .fm-chart .area.color5 {
    fill: #3d96ae;
  }

  .fm-chart .lines .line.color5 {
    stroke: #3d96ae;
  }

  .fm-chart .bar.color4,
  .fm-chart .point.color4,
  .fm-chart .area.color4 {
    fill: #80699b;
  }

  .fm-chart .line.color4 {
    stroke: #80699b;
  }

  .fm-chart .bar.color3,
  .fm-chart .point.color3,
  .fm-chart .area.color3 {
    fill: #89a54e;
  }

  .fm-chart .line.color3 {
    stroke: #89a54e;
  }

  .fm-chart .bar.color2,
  .fm-chart .point.color2,
  .fm-chart .area.color2 {
    fill: #aa4643;
  }

  .fm-chart .line.color2 {
    stroke: #aa4643;
  }

  .fm-chart .bar.color1,
  .fm-chart .point.color1,
  .fm-chart .area.color1 {
    fill: #4572a7;
  }

  .fm-chart .line.color1 {
    stroke: #4572a7;
  }

  .fm-chart.bar.vertical .axis.left .stroke,
  .fm-chart.bar.vertical .axis.left .tick,
  .fm-chart.bar.vertical .axis.right .stroke,
  .fm-chart.bar.vertical .axis.right .tick {
    display: none;
  }

  .fm-tooltip {
    text-align: center;
    padding: 5px 7px;
    color: #fff;
    background: #333;
    border-radius: 3px;
    font-size: 13px;
  }
  ]]>
  </style>
  <g class='axis bottom'>
    <text x='50.000000' y='307.500000' style='text-anchor:middle; dominant-baseline:central;' class='label' >0</text>
    <text x='153.571429' y='307.500000' style='text-anchor:middle; dominant-baseline:central;' class='label' >2.86</text>
    <text x='257.142857' y='307.500000' style='text-anchor:middle; dominant-baseline:central;' class='label' >5.71</text>
    <text x='360.714286' y='307.500000' style='text-anchor:middle; dominant-baseline:central;' class='label' >8.57</text>
    <text x='464.285714' y='307.500000' style='text-anchor:middle; dominant-baseline:central;' class='label' >11.4</text>
    <text x='567.857143' y='307.500000' style='text-anchor:middle; dominant-baseline:central;' class='label' >14.3</text>
    <text x='671.428571' y='307.500000' style='text-anchor:middle; dominant-baseline:central;' class='label' >17.1</text>
    <text x='775.000000' y='307.500000' style='text-anchor:middle; dominant-baseline:central;' class='label' >20.0</text>
    <line x1='50.000000' y1='295.000000' x2='50.000000' y2='290.000000' class='tick' />
    <line x1='153.571429' y1='295.000000' x2='153.571429' y2='290.000000' class='tick' />
    <line x1='257.142857' y1='295.000000' x2='257.142857' y2='290.000000' class='tick' />
    <line x1='360.714286' y1='295.000000' x2='360.714286' y2='290.000000' class='tick' />
    <line x1='464.285714' y1='295.000000' x2='464.285714' y2='290.000000' class='tick' />
    <line x1='567.857143' y1='295.000000' x2='567.857143' y2='290.000000' class='tick' />
    <line x1='671.428571' y1='295.000000' x2='671.428571' y2='290.000000' class='tick' />
    <line x1='775.000000' y1='295.000000' x2='775.000000' y2='290.000000' class='tick' />
    <line x1='50.000000' y1='295.000000' x2='775.000000' y2='295.000000' class='stroke' />
  </g>
  <g class='axis left'>
    <text x='40.000000' y='26.150000' style='text-anchor:end; dominant-baseline:middle;' class='label' >USA</text>
    <text x='40.000000' y='54.450000' style='text-anchor:end; dominant-baseline:middle;' class='label' >CHN</text>
    <text x='40.000000' y='82.750000' style='text-anchor:end; dominant-baseline:middle;' class='label' >JPN</text>
    <text x='40.000000' y='111.050000' style='text-anchor:end; dominant-baseline:middle;' class='label' >DEU</text>
    <text x='40.000000' y='139.350000' style='text-anchor:end; dominant-baseline:middle;' class='label' >FRA</text>
    <text x='40.000000' y='167.650000' style='text-anchor:end; dominant-baseline:middle;' class='label' >GBR</text>
    <text x='40.000000' y='195.950000' style='text-anchor:end; dominant-baseline:middle;' class='label' >BRA</text>
    <text x='40.000000' y='224.250000' style='text-anchor:end; dominant-baseline:middle;' class='label' >RUS</text>
    <text x='40.000000' y='252.550000' style='text-anchor:end; dominant-baseline:middle;' class='label' >ITA</text>
    <text x='40.000000' y='280.850000' style='text-anchor:end; dominant-baseline:middle;' class='label' >IND</text>
    <line x1='50.000000' y1='295.000000' x2='55.000000' y2='295.000000' class='tick' />
    <line x1='50.000000' y1='12.000000' x2='55.000000' y2='12.000000' class='tick' />
    <line x1='50.000000' y1='40.300000' x2='55.000000' y2='40.300000' class='tick' />
    <line x1='50.000000' y1='68.600000' x2='55.000000' y2='68.600000' class='tick' />
    <line x1='50.000000' y1='96.900000' x2='55.000000' y2='96.900000' class='tick' />
    <line x1='50.000000' y1='125.200000' x2='55.000000' y2='125.200000' class='tick' />
    <line x1='50.000000' y1='153.500000' x2='55.000000' y2='153.500000' class='tick' />
    <line x1='50.000000' y1='181.800000' x2='55.000000' y2='181.800000' class='tick' />
    <line x1='50.000000' y1='210.100000' x2='55.000000' y2='210.100000' class='tick' />
    <line x1='50.000000' y1='238.400000' x2='55.000000' y2='238.400000' class='tick' />
    <line x1='50.000000' y1='266.700000' x2='55.000000' y2='266.700000' class='tick' />
    <line x1='50.000000' y1='12.000000' x2='50.000000' y2='295.000000' class='stroke' />
  </g>
  <g class='bars horizontal'>
    <rect x='50.000000' y='18.226000' width='580.000000' height='15.848000' class='bar color1' fm:series='unnamed' fm:label='16800 Billion $' style=''></rect>
    <text x='638.000000' y='26.150000' style='text-anchor:start; dominant-baseline:central;' class='label' >16800 Billion $</text>
    <rect x='50.000000' y='46.526000' width='326.250000' height='15.848000' class='bar color1' fm:series='unnamed' fm:label='9240 Billion $' style=''></rect>
    <text x='384.000000' y='54.450000' style='text-anchor:start; dominant-baseline:central;' class='label' >9240 Billion $</text>
    <rect x='50.000000' y='74.826000' width='145.000000' height='15.848000' class='bar color1' fm:series='unnamed' fm:label='4901 Billion $' style=''></rect>
    <text x='203.000000' y='82.750000' style='text-anchor:start; dominant-baseline:central;' class='label' >4901 Billion $</text>
    <rect x='50.000000' y='103.126000' width='108.750000' height='15.848000' class='bar color1' fm:series='unnamed' fm:label='3634 Billion $' style=''></rect>
    <text x='166.000000' y='111.050000' style='text-anchor:start; dominant-baseline:central;' class='label' >3634 Billion $</text>
    <rect x='50.000000' y='131.426000' width='72.500000' height='15.848000' class='bar color1' fm:series='unnamed' fm:label='2734 Billion $' style=''></rect>
    <text x='130.000000' y='139.350000' style='text-anchor:start; dominant-baseline:central;' class='label' >2734 Billion $</text>
    <rect x='50.000000' y='159.726000' width='72.500000' height='15.848000' class='bar color1' fm:series='unnamed' fm:label='2522 Billion $' style=''></rect>
    <text x='130.000000' y='167.650000' style='text-anchor:start; dominant-baseline:central;' class='label' >2522 Billion $</text>
    <rect x='50.000000' y='188.026000' width='72.500000' height='15.848000' class='bar color1' fm:series='unnamed' fm:label='2245 Billion $' style=''></rect>
    <text x='130.000000' y='195.950000' style='text-anchor:start; dominant-baseline:central;' class='label' >2245 Billion $</text>
    <rect x='50.000000' y='216.326000' width='72.500000' height='15.848000' class='bar color1' fm:series='unnamed' fm:label='2096 Billion $' style=''></rect>
    <text x='130.000000' y='224.250000' style='text-anchor:start; dominant-baseline:central;' class='label' >2096 Billion $</text>
    <rect x='50.000000' y='244.626000' width='72.500000' height='15.848000' class='bar color1' fm:series='unnamed' fm:label='2071 Billion $' style=''></rect>
    <text x='130.000000' y='252.550000' style='text-anchor:start; dominant-baseline:central;' class='label' >2071 Billion $</text>
    <rect x='50.000000' y='272.926000' width='36.250000' height='15.848000' class='bar color1' fm:series='unnamed' fm:label='1876 Billion $' style=''></rect>
    <text x='94.000000' y='280.850000' style='text-anchor:start; dominant-baseline:central;' class='label' >1876 Billion $</text>
  </g>
</svg>
